<!DOCTYPE html>
<html lang="en">
<head th:include="certificateWeb/headFoot :: headerCss">
</head>
<link rel="stylesheet" href="/css/certificateWeb/workNews/workNews.css">

<body id="body">
<div th:include="certificateWeb/headFoot :: header"></div>
<main id="main">
    <section class="sec_1">
        <div class="div_1">
            <ul>
                <li><a href="/certificate/my">个人信息</a></li>
                <li class="this"><a href="/certificate/findApplyExam">报名记录</a></li>
                <li><a href="/certificate/expertRecordList">专家申请记录</a></li>
                <li><a href="/certificate/stationRecordList">考核站点申请记录</a></li>
                <li><a href="/certificate/stationPxRecordList">培训基地申请记录</a></li>
                <li><a href="/certificate/gradeQuery">成绩查询</a></li>
                <li><a href="/certificate/message">消息中心</a></li>
                <li><a href="/certificate/mock?grade=2" target="_blank">幼儿照护初级模拟考试</a></li>
                <li><a href="/certificate/mock?grade=1" target="_blank">幼儿照护中级模拟考试</a></li>
                <li><a href="/certificate/mock?grade=0" target="_blank">幼儿照护高级模拟考试</a></li>
            </ul>
        </div>
        <div class="div_2">
            <label class="label_title">报名记录</label>
            <hr/>
            <div id="news" class="div_01"></div>
            <div id="page"></div>
        </div>
        <div style="clear: both"></div>
    </section>
</main>
<!--在线缴费页面-->
<div id="reward" style="display: none">
    <div style="text-align: center">
        <div style="">订单将在2个小时后关闭，请及时支付</div>
        <div class="mar20">
            <img style="width: 300px" id="img" src=""/>
        </div>
        <div>请使用微信扫一扫完成支付</div>
    </div>
</div>
<div th:include="certificateWeb/headFoot :: footer"></div>
</body>
<script>
    $(function () {
        ajaxToken("/jzApi/user/selMySignUpList", "GET", {
            current: 1,
            number: 8,
            t: new Date()
        }, function (res) {
            if (res.pages == 0) {
                $("#news").html('<div class="noData">暂无数据</div>');
            } else {
                var list = res.records;
                var news = '';
                list.forEach(function (item, index) {
                    var a = '';
                    var b = '';
                    var c = '';
                    if (item.state == 0) {
                        a = '<div><span class="title_1">审核状态：<span style="color: blue" id="state">待审核</span></span></div>';
                    }
                    if (item.state == 1) {
                        a = '<div><span class="title_1">审核状态：<span style="color: orange" id="state">待缴费</span></span></div>';
                        if (item.isYesorNo == 'true') {
                            b = '<div class="my_btn" onclick="wxPay(\'' + item.id + '\')">立即缴费</div>'
                        } else {
                            b = '<div class="my_btn" style="border: 1px solid #999;color: #999;cursor: not-allowed">已停止缴费</div>'
                        }

                    }
                    if (item.state == 2) {
                        a = '<div><span class="title_1">审核状态：<span style="color: red" id="state">未通过</span></span></div>';
                        if (item.isYesorNo == 'true') {
                            c = '<div style="display: flex;justify-content: space-between;align-items: center;">' +
                                '<div class="span_1" style="flex: 6"><span class="title_1">备注：</span><p style="color: red" class="title_2">' + item.remark + '</p></div>' +
                                '<div class="span_1" style="flex: 2;text-align: right"><a href="#" class="my_btn" style="flex:1;text-align: center" onclick="edit(\'' + item.id + '\')" >修改</a></div>' +
                                '</div>'
                        } else {
                            c = '<div style="display: flex;justify-content: space-between;align-items: center;">' +
                                '<div class="span_1" style="flex: 6"><span class="title_1">备注：</span><p style="color: red" class="title_2">' + item.remark + '</p></div>' +
                                '<div class="span_1" style="flex: 2;text-align: right"><a href="#" class="my_btn" style="flex:1;text-align: center;border: 1px solid #999;color: #999;cursor: not-allowed">已停止修改</a></div>' +
                                '</div>'
                        }
                    }
                    if (item.state == 3) {
                        a = '<div><span class="title_1">审核状态：<span style="color: orange" id="state">已分配</span></span></div>';
                        b = '<a href="/certificate/examCard?id=' + item.id + '"><div class="my_btn">查看准考证</div></a>'
                    }
                    if (item.state == 4) {
                        a = '<div><span class="title_1">审核状态：<span style="color: green" id="state">已缴费</span></span></div>';
                    }

                    news += '<div style="margin:10px 0;border-bottom: 1px solid #efefef;padding: 10px 20px">' +
                        '<div style="display: flex">' +
                        '<div class="span_1"><span class="title_1">报名批次：</span><p class="title_2">' + item.name + '</p></div>' +
                        a +
                        '</div>' +
                        '<div style="display: flex;align-items: center">' +
                        '<div class="span_1"><span class="title_1">报名时间：</span><p class="title_2">' + item.signUpTime + '</p></div>' +
                        b +
                        '</div>' +
                        c +
                        '</div>';
                });
                $("#news").html(news);
                page(1, res.pages);
            }
        })
    });

    //立即缴费
    function wxPay(id) {
        ajaxToken("/userInfo/wxPay", "POST", {
            body: '报名费用',
            trade_type: 'NATIVE',
            stuSignUpId: id
        }, function (res) {
            layui.use('layer', function () {
                var layer = layui.layer;
                layer.open({
                    title: '微信扫码',
                    type: 1,
                    area: ['500px', '450px'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: $("#reward"),
                    end: function () {
                        location.reload();
                    },
                    success: function () {
                        $("#img").attr("src", res.wx.data.code_url)
                        monitor(layer, id);
                    }
                });
            });

        });
    }

    var timer = null;

    function monitor(layer, id) {
        timer = window.setInterval(function () {
            queryWxPay(layer, id)
        }, 3000)
    }

    //轮询是否支付成功
    function queryWxPay(layer, id) {
        $.ajax({
            url: "/userInfo/selSignUpState",
            data: {
                stuSignUpId: id
            },
            success: function (data) {
                if (data.data == 4) {
                    window.clearInterval(timer);
                    $("#img").attr("src", '/img/wxsuccess.png');
                    layer.closeAll()
                }
                console.log("data", data);
            }
        });
    }

    function page(num, tolPages) {
        $("#page").paging({
            nowPage: Number(num), // 当前页码
            pageNum: Number(tolPages), // 总页码
            buttonNum: 3, //要展示的页码数量
            canJump: 1,// 是否能跳转。0=不显示（默认），1=显示
            showOne: 0,//只有一页时，是否显示。0=不显示,1=显示（默认）
            callback: function (num) { //回调函数
                ajaxToken("/jzApi/user/selMySignUpList", "GET", {
                    current: num,
                    number: 8,
                    t: new Date()
                }, function (res) {
                    var list = res.records;
                    var news = '';
                    list.forEach(function (item, index) {
                        var a = '';
                        var b = '';
                        var c = '';
                        if (item.state == 0) {
                            a = '<div><span class="title_1">审核状态：<span style="color: blue" id="state">待审核</span></span></div>';
                        }
                        if (item.state == 1) {
                            a = '<div><span class="title_1">审核状态：<span style="color: orange" id="state">待缴费</span></span></div>';
                            if (item.isYesorNo == 'true') {
                                b = '<div class="my_btn" onclick="wxPay(\'' + item.id + '\')">立即缴费</div>'
                            } else {
                                b = '<div class="my_btn" style="border: 1px solid #999;color: #999;cursor: not-allowed">已停止缴费</div>'
                            }

                        }
                        if (item.state == 2) {
                            a = '<div><span class="title_1">审核状态：<span style="color: red" id="state">未通过</span></span></div>';
                            if (item.isYesorNo == 'true') {
                                c = '<div style="display: flex;justify-content: space-between;align-items: center;">' +
                                    '<div class="span_1" style="flex: 6"><span class="title_1">备注：</span><p style="color: red" class="title_2">' + item.remark + '</p></div>' +
                                    '<div class="span_1" style="flex: 2;text-align: right"><a href="#" class="my_btn" style="flex:1;text-align: center" onclick="edit(\'' + item.id + '\')" >修改</a></div>' +
                                    '</div>'
                            } else {
                                c = '<div style="display: flex;justify-content: space-between;align-items: center;">' +
                                    '<div class="span_1" style="flex: 6"><span class="title_1">备注：</span><p style="color: red" class="title_2">' + item.remark + '</p></div>' +
                                    '<div class="span_1" style="flex: 2;text-align: right"><a href="#" class="my_btn" style="flex:1;text-align: center;border: 1px solid #999;color: #999;cursor: not-allowed">已停止修改</a></div>' +
                                    '</div>'
                            }
                        }
                        if (item.state == 3) {
                            a = '<div><span class="title_1">审核状态：<span style="color: orange" id="state">已分配</span></span></div>';
                            b = '<a href="/certificate/examCard?id=' + item.id + '"><div class="my_btn">查看准考证</div></a>'
                        }
                        if (item.state == 4) {
                            a = '<div><span class="title_1">审核状态：<span style="color: green" id="state">已缴费</span></span></div>';
                        }

                        news += '<div style="margin:10px 0;border-bottom: 1px solid #efefef;padding: 10px 20px">' +
                            '<div style="display: flex">' +
                            '<div class="span_1"><span class="title_1">报名批次：</span><p class="title_2">' + item.name + '</p></div>' +
                            a +
                            '</div>' +
                            '<div style="display: flex;align-items: center">' +
                            '<div class="span_1"><span class="title_1">报名时间：</span><p class="title_2">' + item.signUpTime + '</p></div>' +
                            b +
                            '</div>' +
                            c +
                            '</div>';
                    });
                    $("#news").html(news)
                })
            }
        })
    }

    function edit(id) {
        location.href = "/certificate/editExamRecord?id=" + id
    }
</script>
<script type="text/javascript" src="/js/xlPaging.js"></script>
</html>